<!--<!DOCTYPE html>-->
<!--<html>-->

<!--<body>-->
    <!--<img src="wait.png" width="100%" height="100%">-->
<!--</body>-->

<!--</html>-->

<!--<!DOCTYPE html>-->
<!--<html>-->
<!--<body>-->

<!--<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">-->
    <!--<polygon points="100,10 40,180 190,60 10,60 160,180"-->
             <!--style="fill:red;stroke:blue;stroke-width:3;fill-rule:evenodd;" ></polygon>-->
<!--</svg>-->

<!--</body>-->
<!--</html>-->
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8"/>
</head>
<body>

<canvas id="myCanvas" width="250" height="250" >
    Your browser does not support the canvas element.
</canvas>

<script type="text/javascript">

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");


ctx.beginPath();
ctx.moveTo(0,0);
ctx.bezierCurveTo(250,0,0,250,250,250);
ctx.strokeStyle=gradient;
ctx.stroke();

ctx.font="15px Verdana";

// 用渐变填色
ctx.fillStyle=gradient;

ctx.fillText("唐永松",200,200);

ctx.font="35px Verdana";
ctx.fillText("Canvas....",10, 50);

</script>

<br>
<img src="timg.gif" width="100%" height="100%">

</body>
</html>

